<style>
body,h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6{font-family: "Helvetica Neue",Helvetica,"Hiragino Sans GB","Microsoft YaHei","微软雅黑",Arial,sans-serif}
a:hover, a:focus {text-decoration: none;}
.tags-filter a {margin: 0px 0px;padding: 5px 10px;display: inline-block;}
.tags-filter a.active{color: #ffffff;background-color: #95a5a6;border-color: #95a5a6;border-radius: 4px;}
.editor-style-content * {max-width: 100%!important;box-sizing: border-box!important;-webkit-box-sizing: border-box!important;word-wrap: break-word!important;}
.editor-style-content p{margin:0 0;clear:both;min-height:1em;}
.editor-style-content h1,.editor-style-content h2,.editor-style-content h3,.editor-style-content h4,.editor-style-content h5,.editor-style-content h6{font-size:18px;}
.style-list{margin-bottom:60px;box-shadow: 0 0 3px rgba(172,165,150,0.5);background:#ede8de;padding:0px;position:relative;border-radius:2px;}
.style-list:hover{z-index:20;box-shadow: 0 0 5px rgba(172,165,150,0.5);}
.style-list:hover .tools{display:block;}
.style-list .content{background:#fefefe;padding:13px;max-height:450px;overflow:hidden;}
.style-list .tools{text-align:left;width:100%;padding:15px;}
.style-list .info{text-align:left;color:#999;}
.style-list .info p{margin:0;}.style-list .info small{display: inline-block;}    
.style-list .tools a,.style-list .tools a:hover{text-decoration: none;color:#3a3332;font-size:16px;}
.style-list .tools .title{height:24px;line-height:24px;}
.btn-primary,.style-list .tools .label-info{font-size:12px;background:#6b6261 !important;color:#FFF !important;font-weight: normal;border:0 none;}
.style-list .tools .label-info{background:#aaa !important;}
.btn-primary:hover,.style-list .tools .label-info:hover{font-size:12px;background:#3a3332 !important;color:#FFF !important;font-weight: normal;}
/* fix Firefox - max-width images not working within fieldset */
fieldset img{width: 100%;max-width: -moz-fit-content;max-width: -webkit-fit-content;}

.btn-red,.btn-red:hover,.btn-red:focus{font-size:16px;color:#ed603a !important;}

.style-list .origin{position:absolute;top:0;right:0;height:32px;color:#FFF;font-weight:bold;padding:5px}
.nav-pills > li.active > a:hover,.nav-pills > li.active > a,.nav-pills > li > a:hover{color:#f8f5ef !important;background:#6b6261 !important;border:0 none;}
.nav-pills > li >a {background:#e6dfd0;color:#3a3332;padding:5px 15px;margin-right:25px;border-radius:15px;border:0 none;}
.nav-pills {border-bottom: 0 none;}
body.boxed{width: 1280px;}
.container{width:1240px;}
.col-md-4{padding-left:20px;padding-right:20px;}
.template-cover{width:340px;height:480px;max-width: 100%;}
.color-swatch{width:30px;height:30px;border-radius:3px;font-size:12px;cursor: pointer;display: inline-block;margin:4px 4px 0px 0;}
.color-swatch:hover,.color-swatch.active {	
	-webkit-transform:scale(1.1);-moz-transform:scale(1.1);-ms-transform:scale(1.1);
	-o-transform:scale(1.1);transform:scale(1.1);
	-webkit-box-shadow:inset 1px 1px 1px #5b616d,0 0 5px #45bcda;
	-moz-box-shadow:inset 1px 1px 1px #5b616d,0 0 5px #45bcda;
	box-shadow:inset 1px 1px 1px #5b616d,0 0 5px #45bcda;
}
.tooltip-inner{text-align:left;padding:10px 15px;}
</style>
<div class="container" style="margin-top: 20px;">	
	
<ul class="nav nav-pills">
  <li class="pull-right ">
		
  </li>
  
  <li role="presentation" {{if $category_data_model=='EditorStyle' && $_GET['cate_id']!=3}}class="active"{{/if}}><a href="/style-center?cate_id%3C%3E=3">样式</a></li>
  <li role="presentation" {{if $category_data_model=='EditorStyle' && $_GET['cate_id']==3 && !isset($_GET['status'])}}class="active"{{/if}}><a href="/template-center?cate_id=3">模板</a></li>  
  <li role="presentation" {{if $category_data_model=='Image'}}class="active"{{/if}}><a href="/pictures">图片库</a></li>
  <li role="presentation" {{if $category_data_model=='Color'}}class="active"{{/if}}><a href="/color-plans">配色方案</a></li>
  
</ul>
<?php 
function is_wechat_gif($url){
	if(strpos($url,'http://image1.135editor.com/cache/remote/') !== false) {
		$source_url = base64_decode(substr($url,41));
		if(substr($source_url,-10) == 'wx_fmt=gif'){
			return $source_url;
		}
	}
	return false;
}
?>	

<div class="hidden-xs hidden-print">
<!-- portlet cache="900" portlet="notitle" model="Advertise" limit="6" conditions="published=1&cate_id=233" order="priority desc" list_tpl="inner">
		<a href="/advertises/click/{{$item['id']}}" target="_blank" title="{{$item['slogan']}}" style="width:224px;padding:2px;display:inline-block;">
			<img src="{{$item['photo']}}" alt="{{$item['slogan']}}" style="width:220px;">
		</a>
</portlet -->
</div>
<div class="alert alert-warning" style="margin:20px 0px;border:0 none;"><p><strong>提示：</strong> 样式中心的新样式付费用户可直接收藏使用，免费用户5天后可收藏使用。<a href="http://www.135plat.com/charge-service" target="_blank">升级会员</a>，快人一步。</p></div>

<div class="clearfix" style="margin-top:10px;">
	<div class="form-inline">
	<form method="get" action="{{getSearchLinks($this->request,array(),array('name','page','tag_id','cate_id'))}}">
			{{loop $_GET $k $v}}
				<?php if($k=="name" || $k=='page') continue; ?>
				<input type="hidden" name="{{$k}}" value="{{$v}}">
			{{/loop}}
	  <input type="text" style="height:33px;line-height:33px;padding:0 10px;" value="{{$_GET['name']}}" name="name" class="form-control"> <button class="btn btn-default btn-sm" type="submit">搜索</button>
	  </form>
	</div>
<!-- 
<div class="pull-right">
	<a href="javascript:void(0)" class="btn btn-warning btn-sm" onclick="if(confirm('确认要收藏本页所有样式？需要积分收藏的将自动扣除积分')) $('.btn-favorite').trigger('click');">一键收藏本页所有样式</a>
</div> -->


</div>

<portlet return="array" return_var="frags"  cache="900" limit="30" showpages="0" model="Frag"  conditions="deleted[]=0"  order="RAND()"></portlet>
			 
<?php 
$frags =  $frags['datalist'];
$frag_index = 0;
$content0 = $content1 = $content2 = ''; $category_control_name = 'editor_styles';
 ?>
<portlet ulclass="editor-style-list" portlet="body" recursive="1" limit="12" order="id desc" model="EditorStyle"  info="conditions[cate_id]=1&conditions[status]=1"  list_tpl="inner"  title="最新样式">				
	<?PHP 
		$item['slug'] = $item['slug']?$item['slug']:$item['id'];
		ob_start();
    ?>	
	<div>{{template editor_styles/_list}}</div>
	<?php
		$content = ob_get_contents();
		ob_end_clean();
		${'content'.($key%3)} .= $content; 
	?>
</portlet>
<div class="ui-portlet-header">
	      <span class="title">最新样式</span>  
	      <a target="_blank" class="pull-right" href="/style-center?cate_id=1">更多 <i class="fa fa-angle-double-right"></i></a> 
</div>
<div class="row">
	<div id="content-0" class="col-md-4">{{$content0}}</div>
	<div id="content-1" class="col-md-4">{{$content1}}</div>
	<div id="content-2" class="col-md-4">{{$content2}}</div>
</div>

<?php $content0 = $content1 = $content2 = ''; $category_control_name = 'editor_styles'; ?>
<portlet ulclass="editor-style-list" portlet="body" limit="12" order="id desc" model="EditorStyle" info="conditions[cate_id]=53&conditions[status]=1"  list_tpl="inner"  title="分割线">				
	<?PHP 
		$item['slug'] = $item['slug']?$item['slug']:$item['id'];
		ob_start();
    ?>	
	<div>{{template editor_styles/_list}}</div>
	<?php
		$content = ob_get_contents();
		ob_end_clean();
		${'content'.($key%3)} .= $content; 
	?>
</portlet>
<div class="ui-portlet-header">
	      <span class="title">最新分割线</span>  
	      <a target="_blank" class="pull-right" href="/style-center?cate_id=53">更多 <i class="fa fa-angle-double-right"></i></a>           
</div>
<div class="row">
	<div id="content-0" class="col-md-4">{{$content0}}</div>
	<div id="content-1" class="col-md-4">{{$content1}}</div>
	<div id="content-2" class="col-md-4">{{$content2}}</div>
</div>
<?php $content0 = $content1 = $content2 = ''; $category_control_name = 'images'; ?>
<portlet ulclass="editor-style-list" portlet="body" recursive="1" limit="12" order="id desc" model="Image"  info="conditions[cate_id %3C%3E][]=84&conditions[cate_id %3C%3E][]=85" list_tpl="inner"  title="最新图片">				
	<?PHP 
		$item['slug'] = $item['slug']?$item['slug']:$item['id'];
		ob_start();
    ?>	
	<div>{{template images/_list}}</div>
	<?php
		$content = ob_get_contents();
		ob_end_clean();
		${'content'.($key%3)} .= $content; 
	?>
</portlet>
<div class="ui-portlet-header">
	<span class="title">最新图片</span>
	<a target="_blank" class="pull-right" href="/pictures?cate_id%3C%3E[]=84&cate_id%3C%3E[]=85">更多 <i class="fa fa-angle-double-right"></i></a>                   
</div>
<div class="row">
	<div id="content-0" class="col-md-4">{{$content0}}</div>
	<div id="content-1" class="col-md-4">{{$content1}}</div>
	<div id="content-2" class="col-md-4">{{$content2}}</div>
</div>
<?php $content0 = $content1 = $content2 = ''; $category_control_name = 'images'; ?>
<portlet ulclass="editor-style-list" limit="12" recursive="1" order="id desc" portlet="body" model="Image"  info="conditions[cate_id]=85" list_tpl="inner"  title="最新表情">				
	<?PHP 
		$item['slug'] = $item['slug']?$item['slug']:$item['id'];
		ob_start();
    ?>	
	<div>{{template images/_list}}</div>
	<?php
		$content = ob_get_contents();
		ob_end_clean();
		${'content'.($key%3)} .= $content; 
	?>
</portlet>
<div class="ui-portlet-header">
	<span class="title">最新表情</span> 
	<a target="_blank" class="pull-right" href="/pictures?cate_id[]=85">更多 <i class="fa fa-angle-double-right"></i></a>           
</div>
<div class="row">
	<div id="content-0" class="col-md-4">{{$content0}}</div>
	<div id="content-1" class="col-md-4">{{$content1}}</div>
	<div id="content-2" class="col-md-4">{{$content2}}</div>
</div>
<?php $content0 = $content1 = $content2 = ''; $category_control_name = 'images'; ?>
<portlet ulclass="editor-style-list" limit="12" recursive="1" order="id desc" portlet="body" model="Image"  info="conditions[cate_id]=84" list_tpl="inner"  title="最新图标">				
	<?PHP 
		$item['slug'] = $item['slug']?$item['slug']:$item['id'];
		ob_start();
    ?>	
	<div>{{template images/_list}}</div>
	<?php
		$content = ob_get_contents();
		ob_end_clean();
		${'content'.($key%3)} .= $content; 
	?>
</portlet>
<div class="ui-portlet-header">
	<span class="title">最新图标</span>   
	<a target="_blank" class="pull-right" href="/pictures?cate_id[]=84">更多 <i class="fa fa-angle-double-right"></i></a>           
</div>
<div class="row">
	<div id="content-0" class="col-md-4">{{$content0}}</div>
	<div id="content-1" class="col-md-4">{{$content1}}</div>
	<div id="content-2" class="col-md-4">{{$content2}}</div>
</div>

</div>


<div class="container">	
	<portlet title="友情链接" model="Link" limit="60" conditions="published=1" list_tpl="inner">		
		<a href="{{$item['link_url']}}" title="{{$item['name']}}" style="line-height:40px;height:40px;display:inline-block;margin:5px;" target="_blank">
			{{if $item['link_img']}}
			<img src="{{$item['link_img']}}" alt="{{$item['name']}}" style="height:40px;">
			{{else}}
				{{$item['name']}}
			{{/if}}
		</a>
	</portlet>
	<p><small>更多友情链接交换中，请与管理员联系</small></p>
</div>
{{ $this->Combinator->script(array('jquery/masonry.pkgd.min.js','jquery/imagesloaded.pkgd.min.js'));}}
<script>
$(function(){
	
	/*var $container = $('.editor-style-list');
	// initialize Masonry after all images have loaded  
	$container.imagesLoaded( function() {
		$container.masonry({
	        itemSelector: '.mix',
	        animate: true,       
	        animationOptions: {
	            duration: 500,
	            easing: 'linear',
	            queue: false
	        }
	     });
	});*/
	
	/*setTimeout(function(){
		$('#editor-style-list').masonry({
	        itemSelector: '.mix',
	        animate: true,       
	        animationOptions: {
	            duration: 500,
	            easing: 'linear',
	            queue: false
	        }
	      });
	},1000)*/

	$('.style-list .content').hover(function(){
		$(this).animate({'maxHeight':'1000px'});
	},function(){
		$(this).animate({'maxHeight':'450px'});
	});
	
	$('#sort-type').change(function(){
		var url = "{{getSearchLinks($this->request,array(), array('order'))}}";
		if(url.indexOf('?') > 0){
			url = url + '&order='+this.value;
		}
		else{
			url = url + '?order='+this.value;
		}
		window.location.href = url;
	})
})
</script>